/*
 * Copyright(C) 2019 FUYUN DATA SERVICES CO.,LTD. - All Rights Reserved
 * Unauthorized copying of this file, via any medium is strictly prohibited
 * Proprietary and confidential
 * 该源代码版权归属福韵数据服务有限公司所有
 * 未经授权，任何人不得复制、泄露、转载、使用，否则将视为侵权
 *
 */

import * as React from "react";
import { connect } from "react-redux";
import { Form, Input, Select } from "antd";

import { FormComponentProps } from "antd/lib/form";
import { IUser } from "src/models/user/User";

interface IState {
  edit: boolean;
  userData: IUser;
}

interface IProps {
  edit: boolean;
  userData: any;
}

class UserEdit extends React.Component<IProps & FormComponentProps, IState> {
  public constructor(props: IProps & FormComponentProps) {
    super(props);
    this.state = {
      edit: this.props.edit,
      userData: this.props.userData
    };
  }

  public render() {
    const { getFieldDecorator } = this.props.form;
    return (
      <div>
        <Form>
          <Form.Item
            label={"用户名"}
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 12 }}
          >
            {getFieldDecorator("account", {
              initialValue: this.props.userData.account,
              rules: [
                {
                  required: true,
                  message: "请填写用户名"
                }
              ]
            })(<Input disabled={this.state.edit} />)}
          </Form.Item>
          <Form.Item
            label={"名称"}
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 12 }}
          >
            {getFieldDecorator("name", {
              initialValue: this.props.userData.account,
              rules: [
                {
                  required: true,
                  message: "请填写名称"
                }
              ]
            })(<Input disabled={this.state.edit} />)}
          </Form.Item>
          <Form.Item
            label={"密码"}
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 12 }}
          >
            {getFieldDecorator("password", {
              initialValue: this.props.userData.account,
              rules: [
                {
                  required: true,
                  message: "请填写密码"
                }
              ]
            })(<Input disabled={this.state.edit} />)}
          </Form.Item>
          <Form.Item
            label={"状态"}
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 12 }}
          >
            {getFieldDecorator("status", {
              initialValue:
                this.props.userData.account === undefined
                  ? "0"
                  : this.props.userData.account,
              rules: [
                {
                  required: true,
                  message: "请填写密码"
                }
              ]
            })(
              <Select>
                <Select.Option key="0">启用</Select.Option>
                <Select.Option key="1">停用</Select.Option>
              </Select>
            )}
          </Form.Item>
        </Form>
      </div>
    );
  }
}

export default connect()(
  Form.create<IProps & FormComponentProps>({})(UserEdit)
);
